<template>
  <Money v-model="sVal" v-bind="$attrs" />
</template>
<script>
export default {
  props: {
    money: {
      type: [Number, String],
      default: '',
      desc: '数值'
    },
    rate: {
      type: [Number, String],
      default: '',
      desc: '数值'
    },
    value: {
      type: [Number, String],
      default: '',
      desc: '数值'
    }
  },
  data() {
    return {
      sVal: ''
    }
  },
  watch: {
    value(val) {
      if (val) {
        this.sVal = val
      }
    },
    money(nval) {
      if (nval) {
        this.load(true)
      }
    },
    rate(nval) {
      if (nval) {
        this.load(true)
      }
    },
    sVal: {
      handler(val) {
        if (val) {
          this.$emit('input', val)
          this.$emit('change', val)
        }
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    this.load(false)
  },
  methods: {
    load(flag) {
      if (flag === true) {
        const money = this.money
        const rate = this.rate
        if (money !== '' && money !== null && rate !== '' && rate !== null) {
          this.sVal = money * rate
          this.$emit('input', this.sVal)
          this.$emit('change', this.sVal)
        }
      } else {
        this.sVal = this.value
      }
    }
  }
}
</script>
